<template>
	<view>
		<view class="body after-navber">
		    <view class="info">
		        <view class="info-title flex-row">
		            <view class="info-block">
		                <view class="info-up white">分销佣金</view>
		                <view class="info-bottom white">
		                    <view class="big bold">{{  info.total_money }}</view>
		                    <view class="bottom">元</view>
		                </view>
		            </view>
		            <view class="info-block">
		                <navigator openType="navigate" url="/pages2/share/cash-detail/cash-detail">
		                    <view class="info-btn white big-13">提现明细</view>
		                </navigator>
		            </view>
		        </view>
		        <view class="info-content black">
		            <view class="info-label flex-y-center big-13">
		                <view class="info-left text-more">可提现佣金</view>
		                <view class="info-right">{{info.money }}元</view>
		            </view>
		            <view class="info-margin">
		                <view class="info-label big-13">
		                    <view class="border-bottom flex-y-center">
		                        <view class="info-left text-more">已提现佣金</view>
		                        <view class="info-right">{{ info.tx_money }}元</view>
		                    </view>
		                </view>
		                <view class="info-label flex-y-center big-13">
		                    <view class="info-left text-more">待打款佣金</view>
		                    <view class="info-right">{{ info.freeze_money }}元</view>
		                </view>
		            </view>
		         
		        </view>
		        <view class="info-footer">
		            <navigator openType="navigate" url="/pages2/share/cash/cash?type=agent">
		                <view class="info-btn white text-more">我要提现</view>
		            </navigator>
		        </view>
		    </view>
		</view>
	</view>
</template>

<script>
	import {
		Agent
	} from '../../../apirequest/agent-model.js';
	var a = new Agent();
	export default {
		data() {
			return {
					info:''
			}
		},
		onShow() {
			this._index()
		},
		methods: {
			_index(){
				var that = this;
				a.get_info((res) => {
					if(res.code == 1){
						
						that.info = res.data
					}else{
					
						
					}
				})
			},
		}
	}
</script>

<style>
.info {
    width: 100%;
}

.white {
    color: #fff;
}

.black {
    color: #353535;
}

.big {
    font-size: 18pt;
    display: inline-block;
}

.big-13 {
    font-size: 13pt;
}

.big-14 {
    font-size: 14pt;
}

.bottom {
    font-size: 9pt;
    margin-left: 4rpx;
    display: inline-block;
}

.info-margin {
    margin: 20rpx 0;
}

.border-bottom {
    border-bottom: 1rpx #ccc solid;
    height: 100%;
}

.margin-top {
    margin-top: 20rpx;
}

.info .info-title {
    padding: 24rpx 24rpx;
    background-color: #ff4544;
    width: 100%;
}

.info .info-title .info-block {
    width: 50%;
}

.info .info-title .info-block .info-up {
    margin-top: 15rpx;
    padding-bottom: 10rpx;
}

.info .info-bottom {
    display: inline-table;
    width: 100%;
}

.info .info-block .info-btn {
    border: 1rpx #fff solid;
    border-radius: 10rpx;
    text-align: center;
    float: right;
    margin-top: 45rpx;
    padding: 6rpx;
}

.info .info-content {
    width: 100%;
}

.info .info-content .info-label {
    width: 100%;
    height: 96rpx;
    padding: 0 24rpx;
    background-color: #fff;
}

.info-content .info-label .info-left {
    width: 50%;
}

.info-content .info-label .info-right {
    width: 50%;
    text-align: right;
    color: #666666;
}

.info-footer {
    width: 100%;
    padding: 40rpx 24rpx 0 24rpx;
}

.info-footer .info-btn {
    width: 100%;
    background-color: #ff4544;
    height: 100rpx;
    border-radius: 10rpx;
    line-height: 100rpx;
    text-align: center;
}
</style>
